<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- jQuery 主文件 -->
<script type="text/javascript" src="../js/jquery.min.js"></script>
<!-- easyui 主文件 -->
<script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
<!-- 国际化文件 -->
<script type="text/javascript" src="../js/locale/easyui-lang-zh_CN.js"></script>
<!-- easyui 主样式文件 -->
<link rel="stylesheet" href="../js/themes/black/easyui.css" />
<link rel="stylesheet" href="../js/themes/icon.css" />
<script type="text/javascript">
	$(function() {
		$("#quser")
				.datagrid(
						{
							url : "queryuser",
							method : "get",
							columns : [ [
									{
										field : 'userId',
										title : '编号',
										width : 100,
										hidden : true
									},
									{
										field : 'name',
										title : '姓名',
										width : 100,
										align : 'center'
									},
									{
										field : 'level',
										title : '级别',
										width : 100,
										align : 'center'
									},
									{
										field : 'opreate',
										title : '操作',
										width : 100,
										align : 'center',
										formatter : function(value, row, index) {
											return '<a style="color:blue"  href="javascript:updateUser('
													+ "'"
													+ row.userId
													+ "'"
													+ ')">修改</a>'
													+ '<a style="color:blue"  href="javascript:deleteUser('
													+ "'"
													+ row.userId
													+ "'"
													+ ')">/删除</a>';
										}
									}, ] ],
							fit : true,
							toolbar : '#toolbar',
							loadMsg : "数据加载中...，请等待!",
							pageSize : 10,
							singleSelect : true,
							fitColumns : true,
							pagination : true,
							rownumbers : true,
							onClickRow : function(rowIndex, rowData) {
								//								alert(rowIndex);
								//				alert(rowData.name);
							}
						});

		$("#name").blur(function() {
			var name = $("#name").val();
			$.ajax({
				url : "checkusername",
				data : {
					name : name
				},
				type : "GET",
				success : function(result) {
					if (result == "error") {
						$.messager.alert('警告','该用户已存在！','warning');
					}
				}
			});
		});

	})

	function add() {
		$('#win').dialog('open').dialog('setTitle', '添加用户');
	}

	function deleteUser(id) {
		$.messager.confirm('确认','您确认想要删除id为' + id + '用户吗？',function(r){    
		    if (r){    
		    	$.post("deleteuser", {
					id : id
				}, function(str) {
					$.messager.show({
						title : 'Error',
						msg : str
					});
				}, "text");
				$('#quser').datagrid('reload');    
		    }    
		}); 
	}

	function updateUser(id) {
		alert("修改id为" + id + "用户");

	}

	function saveUser() {
		$('#fm').form('submit', {
			url : "adduser",
			onSubmit : function() {
				return $(this).form('validate');
			},
			success : function(result) {
				if (result != '1') {
					$.messager.show({
						title : 'Error',
						msg : "操作失败"
					});
				} else {
					$('#win').dialog('close'); // close the dialog
					$('#quser').datagrid('reload'); // reload the user data
				}
			}
		});
	}
</script>
<style type="text/css">
#fm {
	margin: 0;
	padding: 10px 30px;
}

.ftitle {
	font-size: 14px;
	font-weight: bold;
	color: #666;
	padding: 5px 0;
	margin-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

.fitem {
	margin-bottom: 5px;
}

.fitem label {
	display: inline-block;
	width: 80px;
}
</style>
<title>用户查询</title>
</head>
<body>
	<table id="quser" title="用户表"></table>
	<div id="toolbar">
		<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true"
			onclick="edit()">编辑</a> <a href="#" class="easyui-linkbutton"
			iconCls="icon-add" plain="true" onclick="add()">添加</a> <a href="#"
			class="easyui-linkbutton" iconCls="icon-search" plain="true"
			onclick="select()">查询</a> <a href="#" class="easyui-linkbutton"
			iconCls="icon-print" plain="true" onclick="print()">打印</a>
		<div style="margin-left: 250px; margin-top: -26px">
			<input id="fa" class="easyui-datebox">
			<div style="margin-top: -22px; margin-left: 180px">
				<input type="button" id="btnSearch" value="查询">
			</div>
		</div>
	</div>
	
	<div id="win" class="easyui-dialog"
		style="width: 400px; height: 250px; padding: 10px 20px" closed="true"
		buttons="#dlg-buttons">
		<div class="ftitle">PurchaseList Information</div>
		<form id="fm" method="post" novalidate>
			<div class="fitem">
				<label>用户名:</label> <input id="name" name="name"
					class="easyui-validatebox" required="true">
			</div>
			<div class="fitem">
				<label>密码:</label> <input type="password" name="password"
					class="easyui-validatebox" required="true">
			</div>
			<div class="fitem">
				<label>身份:</label> <select name="level" class="easyui-combobox"
					required="true" style="width: 173px">
					<option>财务部员工</option>
					<option>技术部员工</option>
					<option>销售部员工</option>
					<option>仓储部员工</option>
					<option>采购部员工</option>
					<option>财务部部长</option>
					<option>技术部部长</option>
					<option>销售部部长</option>
					<option>仓储部部长</option>
					<option>采购部部长</option>
					<option>管理员</option>
					<option>总经理</option>
				</select>
			</div>

		</form>
	</div>
	<div id="dlg-buttons">
		<a href="#" id="butt" class="easyui-linkbutton" iconCls="icon-ok"
			onclick="saveUser()">Save</a> <a href="#" class="easyui-linkbutton"
			iconCls="icon-cancel" onclick="javascript:$('#win').dialog('close')">Cancel</a>
	</div>
</body>
</html>
